import createjs from 'createjs-ts'
import { getSnakeHeadImg } from '@/assets/snake/index'
import head from '@/assets/snake/snake-head.png'
class SnakeNode extends createjs.Container {
	type = "SNAKE_NODE"
	constructor(snake, user, isHead, angle) {
		super();
		this.ParentID = undefined
		this.snakeHead = null
		this.nodeDrawBg = null
		this.bodyType = isHead ? 'head' : 'body'
		this.foreGround = (snake && snake.snakeInfo.color) || '#000';
		this.scaleNum = 1
		this.nodeRadius = snake.snakeInfo.bodyRadius
		this.accelerateAnimation = null
		if(this.bodyType === 'head') {
			this.drawHead(snake, angle)
			if (user) this.drawName(user)
			this.invincibleAnimationInfo = {
				isProgress: false,
				scaleType: '+',
				everyScaleNum: 0.01,
				maxScaleNum: 1.3,
				minScaleNum: 0.8,
				timer: null,
			}
		} else {
			this.drawBody()
		}
		// this.drawAccelerateAnimation(snake)
		
	}
	async drawHead(snake) {
		let nodeDrawBg = new createjs.Shape(); 
		const radius = this.nodeRadius + 8
		const diameter = radius * 2
		
		nodeDrawBg.graphics.beginRadialGradientFill(["#FFF", this.foreGround], [0, 1], 0, 0, radius, 0, 0, radius*2).setStrokeStyle(radius/2, 'round').drawCircle(0, 0, radius * 2).endFill();
		this.nodeDrawBg = nodeDrawBg
		nodeDrawBg.alpha = 0
		// 绘画图像
		const snakeBody = await getSnakeHeadImg()
		const snakeBodyBitMap = new createjs.Bitmap(snakeBody)
		this.snakeHead = snakeBodyBitMap
		// 设置图片大小
		snakeBodyBitMap.scaleX = diameter / snakeBody.width
		snakeBodyBitMap.scaleY = diameter / snakeBody.height
		snakeBodyBitMap.regX = snakeBody.width / 2
		snakeBodyBitMap.regY = snakeBody.height / 2
		snakeBodyBitMap.mask = nodeDrawBg
		snakeBodyBitMap.rotation = 90
		this.addChild(nodeDrawBg);
		this.addChild(snakeBodyBitMap)
		this.setBounds(-radius, -radius, diameter, diameter);
	}

	updateSnakeHeadRotate(snakeDir) {
		// debugger
		const angle = Math.atan2(snakeDir.y, snakeDir.x)  * (180 / Math.PI)
		this.snakeHead && (this.snakeHead.rotation = (angle + 90))
		// this.accelerateAnimation.rotation = (angle - 90)
		// this.nodeDrawBg.scale -= 0.01
	}
	drawBody() {
		// 外层基础圆圈
		let baseCircle = new createjs.Shape(); 
		baseCircle.graphics.beginFill(this.foreGround).drawCircle(0, 0, this.nodeRadius).beginFill('#fff').drawCircle(0, 0, this.nodeRadius * 0.2).endFill();
		// 绘画图像
		// const snakeBody = isHead ? getSnakeHeadImg() : getSnakeBodyImg()
		// const snakeBodyBitMap = new createjs.Bitmap(snakeBody)
		// snakeBodyBitMap.scaleX = 30 / snakeBody.width
		// snakeBodyBitMap.scaleY = 30 / snakeBody.height
		// snakeBodyBitMap.x = -15
		// snakeBodyBitMap.y = -15
		// let snakeBodyMask = new createjs.Shape(); 
		// snakeBodyMask.graphics.beginFill('#000').drawCircle(0, 0, 18).endFill();
		// snakeBodyBitMap.mask = snakeBodyMask
		this.nodeDrawBg = baseCircle
		this.addChild(baseCircle);
		// this.addChild(snakeBodyMask)
		// this.addChild(snakeBodyBitMap)
		this.setBounds(-this.nodeRadius, -this.nodeRadius, this.nodeRadius * 2, this.nodeRadius * 2);
	}
	setParentId(id) {
		this.ParentID = id
	}
	drawName(user) {
		var text = new createjs.Text(user, "12px Arial", "#ff7700");
		text.x = -text.getMeasuredWidth() / 2;
		text.y = -28;
		text.textBaseline = "alphabetic";
		this.addChild(text);
	}
	scaleAddNode(scale) {
		if(this.nodeDrawBg) {
			this.nodeDrawBg.scaleX = scale
			this.nodeDrawBg.scaleY = scale
		}
		if(this.snakeHead) {
			this.snakeHead.scaleX = scale
			this.snakeHead.scaleY = scale
		}
	}
	setForeGround(color) {
		this.foreGround = color;
		this.removeAllChildren();
		this.drawBody();
	}

	drawAccelerateAnimation() {
		
	}
	/**
	 * 无敌期间动画
	 */
	updateInvincibleAnimation() {
		if(!this.nodeDrawBg) {
			let nodeDrawBg = new createjs.Shape(); 
			const radius = this.nodeRadius + 8
			nodeDrawBg.graphics.beginRadialGradientFill(["#FFF", this.foreGround], [0, 1], 0, 0, radius, 0, 0, radius*2).setStrokeStyle(radius/2, 'round').drawCircle(0, 0, radius * 2).endFill();
			this.nodeDrawBg = nodeDrawBg
			nodeDrawBg.alpha = 0
		}
		if(!this.invincibleAnimationInfo.isProgress) {
			this.invincibleAnimationInfo.isProgress = true
			this.nodeDrawBg.alpha = 0.6
		}
		if(this.invincibleAnimationInfo.scaleType === '+') {
			this.nodeDrawBg.scale += this.invincibleAnimationInfo.everyScaleNum
			if(this.nodeDrawBg.scale >= this.invincibleAnimationInfo.maxScaleNum) {
				this.invincibleAnimationInfo.scaleType = '-'
			}
		} else if (this.invincibleAnimationInfo.scaleType === '-') {
			this.nodeDrawBg.scale -= this.invincibleAnimationInfo.everyScaleNum
			if(this.nodeDrawBg.scale <= this.invincibleAnimationInfo.minScaleNum) {
				this.invincibleAnimationInfo.scaleType = '+'
			}
		}
	}
	removeInvincibleAnimation() {
		if(this.invincibleAnimationInfo.isProgress) {
			this.nodeDrawBg.alpha = 0
			this.invincibleAnimationInfo.isProgress = false
		}
	}
	/**
	 * 加速期间动画
	 */
	updateAccelerateAnimation() {
		if(!this.accelerateAnimation) {
			this.accelerateAnimation = new createjs.Shape()
			this.accelerateAnimation.graphics.setStrokeStyle(6, "round").beginStroke("#ffffff").moveTo(this.nodeRadius / 2, 0).lineTo(-this.nodeRadius /2, 0).endStroke();
			this.accelerateAnimation.x = 0
			this.accelerateAnimation.rotation = 90
	
			let blurFilter = new createjs.BlurFilter(8, 8, 1);
			this.accelerateAnimation.filters = [blurFilter];
			const bounds = blurFilter.getBounds();
			this.accelerateAnimation.cache(-50+bounds.x, -50+bounds.y, 100+bounds.width, 100+bounds.height);
			this.addChild(this.accelerateAnimation)
		}
		const angle = Math.atan2(this.y, this.x)  * (180 / Math.PI)
		this.accelerateAnimation.rotation = -angle - 90

		this.accelerateAnimation.x -= 1
		this.accelerateAnimation.y -= 1
		if(Math.abs(this.accelerateAnimation.x) >= this.nodeRadius || Math.abs(this.accelerateAnimation.y) >= this.nodeRadius) {
			this.removeAccelerateAnimation()
		}
	}
	removeAccelerateAnimation() {
		this.removeChild(this.accelerateAnimation)
		this.accelerateAnimation = null
	}
}



export default SnakeNode